<template>
    <div class="zora-world por">
        <router-view></router-view>
        <p class="icp"><a href="http://beian.miit.gov.cn">皖ICP备16025747号-2</a>
            <a target="_blank" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=34010402703199">
                <img src="@/assets/img/ba.png" style="float:left;margin-right: 5px;"/>
        <span style="">皖公网安备 34010402703199号</span></a>
        </p>
    </div>
</template>
<script lang="ts">
    import Vue, { VueConstructor } from 'vue'
    import Component from 'vue-class-component'
    import { Getter, Action } from 'vuex-class';

    declare module 'vue/types/vue' {
        interface Vue {
            $message: any,
            $confirm: any,
            validate: Function,
            resetFields: Function
        }

        interface VueConstructor {
            $message: any,
            $confirm: any,
            validate: Function,
            resetFields: Function
        }
    }

    @Component
    export default class App extends Vue {

        @Action('getUserData')
        getUserData(data: any) {}

      created() {
          const token = sessionStorage.getItem('zw_token');
          if (token) {
              window.post('user_token', {token: token}, (res: any) => {
                  if (res.error_code === 0) {
                      this.getUserData(res.data);
                  } else {
                      this.$message.error(res.message);
                  }
              });
          }
      }
    }
</script>

<style lang="less">
.icp {
    width: 100%;
    text-align: center;
    line-height: 20px;
    font-size: 12px;
    color: #666;
    position: absolute;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    a {
        display:inline-block;text-decoration:none;height:20px;line-height:20px;margin-left: 20px;
        float:left; color:#939393;
    }
}
.content {
       width: 1200px;
       height: 800px;
       position: relative;
       margin: 0 auto;
       }
       #canvas1,#canvas2 {
           position: absolute;
           left: 0px;
           bottom: 0px;
           z-index: 0;
       }
       #canvas2 {
           z-index: 1;
       }
       .rule {
           position: absolute;
           left: 0;
           top: 0;
           width: 250px;
           height: auto;
           min-height: 800px;
           background-color: yellow;
           padding: 10px 10px;
           font-size: 16px;
           font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
           color: #67b168;
           transition: left 0.3s ease;

           &.hide-rule {
               left: -240px;
           }
       }
</style>
